<template>
  <div class="app-container">
    <img src="../../static/img/login-right.png" style="width:100%;margin:0 -10px">
    <van-form @submit="onSubmit">
      <van-field v-model="phone" name="phone" label="手机号" placeholder="请输入手机号"
        :rules="[{ required: true, message: '请输入账号' }]" />
      <van-field v-model="password" type="password" name="password" :rules="[{ required: true, message: '请输入密码' }]"
        label="密码" placeholder="请输入密码" />
      <van-field v-model="repassword" :rules="[{ required: true, message: '请再次输入密码' }]" type="password"
        name="repassword" label="重复密码" placeholder="请再次输入密码" />
      <div style="margin: 16px;">
        <van-button round block type="info" native-type="submit">注册</van-button>
        <a @click="login" style="float:right">已有账号？马上登录</a>
      </div>
    </van-form>
    <xFooter />
  </div>
</template>
<script>
import { addMember, listMember, register } from "@/api/member/member"
import { Toast } from 'vant';
export default {
  data () {
    return {
      phone: '',
      password: '',
      repassword: '',
      uerList: [],
      userInfo: {
        id: ''
      }
    }
  },

  methods: {
    //   提交
    onSubmit (val) {
      const data = {
        phone: val.phone,
        password: val.password,
        nickName: "昵称" + Math.round(Math.random() * 1000),
        avatar: "/profile/upload/2022/04/07/下载_20220407113633A001.png",
        enabled: 0
      }
      register(data).then(res => {
        if (val.password != val.repassword) {
          Toast.fail('两次密码不同');
        } else if (res.data == undefined || null) {
          addMember(data).then(res => {
            console.log(res)
            if (res.code == 200) {
              Toast.loading({
                message: '正在注册...',
                forbidClick: true,
              });
              setTimeout(() => {
                Toast.clear();
                this.$router.push('/login')
                Toast.success('注册成功!');
              }, 1000);
            } else {
              Toast.fail('未知错误');
              return 0;
            }
          })
          console.log("注册")
        } else {
          Toast.fail('账号已被注册');
        }

      })

    },
    login () {
      this.$router.push('/login')
    }
  },
}
</script>
<style scoped>
a {
  font-size: 14px;
  cursor: pointer;
  color: rgb(51, 153, 255);
}
</style>